<!-- 
	name: 设置列表
 
 -->
<template>
	<view class="settimg-box">
		<cu-custom :isBack="true" bgColor="bg-fa">
			<block slot="content">设置</block>
		</cu-custom>
		
		<!--  功能列表  -->
		<view class="list-box">
			<view class="list-item" v-for="(item,index) in listTab" :key="index" @tap="navTo(item)">
				<view class="item-name">
					<text class="iconfont" :class="[item.icon]"></text>
					<text class="name">{{item.name}}</text>
				</view>
				<view class="item-icon">
					<text class="iconfont iconxiangyou1"></text>
				</view>
			</view>
		</view>
		<view class="btn-box">
			<u-button shape="square" :custom-style="{'border':'none','color':'#ffffff','background':'#FA436A'}" :ripple="true" 
			@tap="loginOut">退出登录</u-button>
		</view>
		<u-modal v-model="show" @confirm="confirmLoginOut" content="是否退出登录" :show-cancel-button="true"></u-modal>
	</view>
</template>

<script>
	export default {
		name:"setting",
		data(){
			return {
				show:false,
				listTab:[
					{name:"个人信息设置",icon:"icongerenxinxi",path:"/pages/setting/mine"},
					{name:"更换手机号码",icon:"iconphone",path:"/pages/setting/phone"},
					{name:"修改密码",icon:"iconanquan",path:"/pages/setting/changepsd"},
					{name:"我的地址",icon:"icondizhi",path:"/pages/setting/addrList"},
					{name:"给点鼓励",icon:"icondianzan",path:"/pages/setting/encourage"},
					{name:"帮助反馈",icon:"iconbangzhuzhongxin",path:"/pages/setting/feedback"},
					{name:"关于我们",icon:"iconkefu",path:""},
				]
			}
		},
		methods:{
			
			/*  去列表功能页面  */
			navTo(item){
				uni.navigateTo({
					url:item.path
				})
			},
			
			/*  退出登录  */
			loginOut(){
				this.show = true
			},
			confirmLoginOut(){
				this.$ajax("loginOut",{},'get').then((res)=>{
					uni.removeStorage({
						key:"userInfo"
					})
					this.$store.commit("user/setUserInfo",null)
					uni.switchTab({
						url:"/pages/index/index"
					})
				})
			}
			
			
		}
	}
</script>

<style scoped lang="scss">
	.settimg-box{
		background: #FFFFFF;
		box-sizing: border-box;
		.list-box{
			width: calc(100% - 80rpx);
			margin-left: 40rpx;
			.list-item{
				width: 100%;
				display: flex;
				justify-content: space-between;
				align-items: center;
				height: 100rpx;
				.item-name{
					.iconfont{
						font-size: 40rpx;
						color: #3e3e3e;
					}
					.name{
						font-size: 28rpx;
						color: #3e3e3e;
						vertical-align: text-bottom;
						padding-left: 20rpx;
					}
				}
				.item-icon{
					.iconfont{
						color: #a0a0a0;
						font-size: 28rpx;
					}
				}
			}
		}
		.btn-box{
			position: fixed;
			left: 0;
			right: 0;
			bottom:40rpx;
			box-sizing: border-box;
			padding:0 20rpx;
		}
	}
</style>
